import { createApp } from "vue"
import App from "./App.vue"
import router from "./router"
//引入stores暴露出的pinia的实例
import pinia from './stores/index'
import "ant-design-vue/dist/reset.css"

import "./assets/iconfont/iconfont.css"

// 主题切换
import Theme from "./components/theme/index.vue"

import Flex from "./components/flex/index.vue"
import Particles from "./components/particlesJS/index.vue"

import zText from './components/z-components/zText.vue'

import zColorPicker  from './components/z-components/zColorPicker.vue'

import { ConfigProvider, DatePicker,Layout, Button, Input, InputNumber, Row, Col,
  Switch, Dropdown, Menu, Modal, Tabs, Form, Drawer, Card, Tag, Spin, Slider, Radio,
  Select, Collapse, Tooltip } from 'ant-design-vue'


// 全局前置守卫
router.beforeEach((to, from, next) => {
  // console.log(111, to, from)
    // 返回 false 以取消导航
  if (to.query?.hideHeader) {
    sessionStorage.setItem('hideHeader', to.query.hideHeader)
  }
  
  next()
})


const app = createApp(App)

app.component('a-theme', Theme)
.component('a-flex', Flex)
.component('a-particles', Particles)
.component('z-text', zText)
.component('z-color-picker', zColorPicker)
.use(ConfigProvider)
.use(Layout)
.use(Button)
.use(Input)
.use(InputNumber)
.use(DatePicker)
.use(Row)
.use(Col)
.use(Switch)
.use(Dropdown)
.use(Menu)
.use(Modal)
.use(Tabs)
.use(Form)
.use(Drawer)
.use(Card)
.use(Tag)
.use(Spin)
.use(Slider)
.use(Radio)
.use(Select)
.use(Collapse)
.use(Tooltip)
.use(pinia).use(router).mount('#app')
